export const chartOption = (chartData: any) => {

    const option = {
        backgroundColor: '#1b2735',
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                crossStyle: {
                    color: '#999'
                }
            }
        },

        legend: {
            top: '5%',
            data: ['降雨量', '温度'],
            textStyle: {
                color: '#fff'
            }
        },
        grid: {
            top: '20%',
            left: '10%',
            right: '10%',
            bottom: '15%'
        },
        xAxis: [
            {
                type: 'category',
                data: chartData.xData,
                axisPointer: {
                    type: 'shadow'
                },
                axisLine: {
                    lineStyle: {
                        color: 'white'

                    }
                },
                axisLabel: {
                    // interval: 0,
                    // rotate: 40,
                    textStyle: {
                        fontFamily: 'Microsoft YaHei'
                    }
                },

            }
        ],
        yAxis: [
            {
                type: 'value',
                name: '降雨量',
                min: 0,
                max: 250,
                interval: 50,
                axisLabel: {
                    formatter: '{value} ml',
                    textStyle: {
                        fontFamily: 'Microsoft YaHei'
                    }
                },
                axisLine: {
                    lineStyle: {
                        color: 'white'

                    }
                }

            },
            {
                type: 'value',
                name: '温度',
                min: 0,
                max: 40,
                interval: 5,
                axisLabel: {
                    formatter: '{value} °C',
                    textStyle: {
                        fontFamily: 'Microsoft YaHei'
                    }
                },
                axisLine: {
                    lineStyle: {
                        color: 'white'

                    }
                },
                splitLine: {
                    show: false
                }
            }
        ],
        series: [
            {
                name: '降雨量',
                type: 'bar',
                tooltip: {
                    valueFormatter: function (value: any) {
                        return value + ' ml';
                    }
                },
                data: chartData.barData
            },
            {
                name: '温度',
                type: 'line',
                yAxisIndex: 1,
                tooltip: {
                    valueFormatter: function (value: any) {
                        return value + ' °C';
                    }
                },
                data: chartData.lineData
            }
        ]
    };

    return option
}